<?xml version='1.0' encoding='ISO-8859-1' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>IGNORED</title>
    </h:head>
    <h:body>
        <ui:composition template="/template/tmp.xhtml">
            <ui:define name="left">
                <ui:include src="/calcs/left.xhtml"/>
            </ui:define>

            <ui:define name="content">
                <h:form>
                    <h:panelGrid columns="3" style="color: white">
                        <h:column>
                            <h:outputText value="Start volume: "/>
                        </h:column>
                        <h:column>
                            <h:inputText id="start" value="#{calc.startvol}" required="true" requiredMessage="error!">
                                <f:ajax event="keyup" execute="@this" render="totvol"/>
                            </h:inputText>
                        </h:column>
                        <h:column>
                            <h:message for="start"/>
                        </h:column>
                        <h:column>
                            <h:outputText value="SG: "/>
                        </h:column>
                        <h:column>
                            <h:inputText id="sg" value="#{calc.sg}" required="true" requiredMessage="error!">
                                <f:ajax event="keyup" execute="@this" render="fsg"/>
                            </h:inputText>
                        </h:column>
                        <h:column>
                            <h:message for="sg"/>
                        </h:column>
                        <h:column>
                            <h:outputText value="Vann lagt til: "/>
                        </h:column>
                        <h:column>
                            <h:inputText id="vann" value="#{calc.vann}" required="true" requiredMessage="error!">
                                <f:ajax event="keyup" execute="@this" render="totvol"/>
                                <f:ajax event="keyup" execute="@this" render="fsg"/>
                            </h:inputText>
                        </h:column>
                        <h:column>
                            <h:message for="vann"/>
                        </h:column>
                        <h:column>
                            <h:outputText style="font-size: 180" value="Total volume: "/>
                        </h:column>
                        <h:column>
                            <h:outputText id="totvol" value="#{calc.totVol()}"/>
                        </h:column>
                        <h:column>
                            
                        </h:column>
                        <h:column>
                            <h:outputText value="Final SG: "/>
                        </h:column>
                        <h:column>
                            <h:outputText id="fsg" value="#{calc.beregnDil()}">
                            </h:outputText>
                        </h:column>
                        <h:column>
                            
                        </h:column>
                    </h:panelGrid>

                    <h:commandButton value="Reset">
                        <f:ajax event="keyup" execute="#{calc.resetForm()}"/>
                    </h:commandButton>
                    <h:commandButton value="Tilbake" action="/index?faces-redirect=true"/>
                </h:form>
            </ui:define>
        </ui:composition>
    </h:body>
</html>